<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			*{
				padding: 0;
				margin: 0;
			}
			canvas{
				background: #272822;
			}
		</style>
	</head>
	<body>
		<canvas id='canvas' width='800' height='500'></canvas>
		<script>
			//获得画板
			var canvas=document.getElementById('canvas');
			//获得绘画环境
			var cv=canvas.getContext('2d');
			cv.fillStyle='#272822';
			cv.fillRect(0,0,800,500);
			//获得图像的所有像素点的信息
			var alldata=cv.getImageData(0,0,800,500);
			//循环，将获得的数据的每个值都随机
			for(var i=0;i<alldata.data.length;i++){
				//随机0-255之间的随机整数(y+1-x)+x
				var num=Math.floor(Math.random()*(255+1-0)+0);
				alldata.data[i]=num;
			}
			//将处理后的数据存储回画板
			cv.putImageData(alldata,0,0);
		</script>
	</body>
</html>
